/*
** PAGE
*/
body {
    background: #f4f4f4;
    font-family: $font-roboto;
    margin:0;
    font-size: 11px;
    
    a {
        text-decoration: none;

        &:hover {
            text-decoration: none;
        }
    }
    #datepicker {
        padding-left: 55px;

        .ui-datepicker-title {
            display: none;
        }
        .ui-datepicker {
            margin: 0;
            width: 24em;
            border-top: 1px solid #999999;
        }
        .ui-corner-all {
            top: 55px;
        }
        .ui-datepicker-calendar {
            width: 100%;
            height: 100%;

            &.in-month-1 {
                background: url('../images/bg-datepicker-1.png') no-repeat -70px 0;
            }
            &.in-month-2 {
                background: url('../images/bg-datepicker-2.png') no-repeat -70px 0;
            }
            &.in-month-3 {
                background: url('../images/bg-datepicker-3.png') no-repeat -70px 0;
            }
            &.in-month-4 {
                background: url('../images/bg-datepicker-4.png') no-repeat -70px 0;
            }
            &.in-month-5 {
                background: url('../images/bg-datepicker-5.png') no-repeat -70px 0;
            }
            &.in-month-6 {
                background: url('../images/bg-datepicker-6.png') no-repeat -70px 0;
            }
            &.in-month-7 {
                background: url('../images/bg-datepicker-7.png') no-repeat -70px 0;
            }
            &.in-month-8 {
                background: url('../images/bg-datepicker-8.png') no-repeat -70px 0;
            }
            &.in-month-9 {
                background: url('../images/bg-datepicker-9.png') no-repeat -70px 0;
            }
            &.in-month-10 {
                background: url('../images/bg-datepicker-10.png') no-repeat -70px 0;
            }
            &.in-month-11 {
                background: url('../images/bg-datepicker-11.png') no-repeat -70px 0;
            }
            &.in-month-12 {
                background: url('../images/bg-datepicker-12.png') no-repeat -70px 0;
            }
        }   
    }
}

.home {
    #main {
        background:#272626;
        .hot-event {
            margin-top: -15px;
            .title {
                color: $default-color;
                background: $bg-f4-color;
                padding: 15px 0 25px 15px;
                position: relative;
                bottom: -15px;
            }
            .dg-container {

            }
        }
        .free-entrance {
            background: $bg-3-color;
            padding-bottom: 10px;
            h2.title {
                font-size: 2.5em;
            }
            h3.title {
                font-size: 1.8em;
                font-weight: 400;
                color: $white;
                &:hover,
                &:active {
                    color: $pink-color;
                }
            }
            .thumb img {
                max-width: 35px;
            }
            .caption {
                padding-left: 10px;
            }
            .address {
                font-size: 1em;
            }
            .list-events {
                border: 0;
                padding: 0;
            }
        }
        .comming-up {
            .time {
                font-size: 1.4em;
            }
        }
    }
    h2.title {
        color:white;
    }
    .wrapper-view-more {
        text-align: center;
        font-size: 1.4em;
    }    
}
#main .inner {
    margin: 0 15px;
    display: block;
}
.hidden {
    display: none;
}
.page {
    margin: 0 auto;
    width: 100%;
}
h2.title {
    font-size: 2em;
    font-family: $font-roboto;
    font-weight: normal;
    text-transform: uppercase;
    padding:15px 0;
    margin:0;
    font-weight: 300;
}
.footer {
    padding: 10px;
    .inner {
        padding: 0;
    }
    .list-1 {
        padding: 0;
        margin: 0;
        li {
            padding: 0;
            margin: 0;
            a {
                font-size: 1.1em;
            }
        }
    }
    p {
        display: inline-block;
        font-size: 1.1em;
    }
}
.view-more {
    text-align: center;
    color:white;
    font-weight: 100;
    display: inline-block;
}
.carousel-block {
    width: 100%;
    .carousel-control {
        background: url(../images/icon-next-pre.png) 0 0 no-repeat;
        width: 23px;
        height: 23px;
        opacity: 1;
        text-shadow: none;
        border: none;
        &:hover {
            background-position: -30px 0;
        }
    }
    .carousel-control.right{
        background-position: 0 -40px;
        &:hover {
            background-position: -30px -40px;
        }
    }
    .control {
        position:absolute;
        top:-30px;
        right:0;
        width: 55px;
    }
}

.news-item {
    overflow: hidden;
    margin: 0 0 15px;
    position:relative;
    background: white;
    > a{
        display: block;
    }
    .col {
        float:left;
    }
    .wrap-time {
        width: 15%;
        overflow: hidden;
        background:#141414;
        position:absolute;
        top:0;
        left:0;
        bottom:0;
        text-align: center;
    }
    .thumb {
        width: 28%;
        overflow: hidden;
        margin-left: 15%;
        img {
            display: block;
            width:100%;
            height:auto;
        }
        span {
            display: block;
        }
    }
    .time {
        display: inline-block;
        color: white;
        font-family: $font-roboto;
        text-transform: uppercase;
        color: white;
        text-align: center;
        font-size: 1.6em;
        padding-top: 10px;
        font-weight: 100;
        span {
            display: block;
            font-size: 0.7em;
        }
    }
    .caption {
        float:left;
        width: 52%;
        strong {
            font-weight: bold;
        }
        .text-1 {
            padding: 0 0 0 15px;
        }
        .event-name {
            font-family: $font-roboto;
            margin: 0;
            color:#333;
            font-weight: 100;
            max-height: 1.2em;
            font-size: 1.6em;
            overflow: hidden;
        }
        .address {
            font-size: 1.2em;
            font-family: $font-roboto;
            color: #999999;
            display: block;
            text-transform: uppercase;
        }
        .view-people {
            overflow:hidden;
            position: absolute;
            left:0;
            bottom: 0;
            // font-size: 12px;
            font-size: 1.4em;
            width: 180px;

            span {
                color: #666666;
                background:#ebebeb;
                text-align: center;
                height: 42px;                
                line-height: 42px;
                display: block;
                font-family: $font-os;

                strong {
                    color: #333333;
                }
            }
            img {
                max-width: 22px;
                display: inline-block;
                margin:0 1px;
            }
        }
        .list-img-people {
            overflow: hidden;
            background: #d4d4d4;
            width: 100%;
            text-align: center;
            padding: 10px 0;    
            img {
                display: inline-block;
            }
        }
    }
}

.coming-up{
    overflow: hidden;
    .news-item {
        > a {
            display: block;
            overflow: hidden;
            background: white;
            &:hover {
                background:#d4d4d4;
                .caption {
                    background: url(../images/bgd-caption-small-hover.png) 0 0 no-repeat;
                    .view-people {
                        background: #ebebeb;
                    }
                } 
            }
        }
        .caption {
            width: 100%;
            float: none;
            overflow: hidden;
            position: relative;
            z-index: 2;
            margin-top:-12px;
            background: url(../images/bgd-caption-small.png) 0 0 no-repeat;
            z-index: 100;
            .address {
                margin:0;
            }
        }
        .list-img-people {
            background: none;
            width: auto;
            padding: 0 0 3px;
        }
        .time {
            position: absolute;
            top:15px;
            left:13px;
            z-index: 1;
        }
        .view-people {
            position: relative;
            width: auto;
            background: #d4d4d4;
            padding: 0 15px;
            margin: 20px 0 0;
            height: 42px;
            line-height: 42px;

            span {
                background: none;
            }
        }
        .text-1 {
            padding: 0 15px;
        }
        .thumb {
            position: relative;
            img {
                display: block;
                width: 100%;
            }
        }
    }
}


.thanks {
    width: 100%;
    text-align:center;
    padding: 25px 0;

    .btn {
        margin-top: 40px;
    }
    .row .col-lg-5:first-child {
        text-align: right;
        padding-top: 8%;
    }
    span {
        font-family: $font-os;
        color: #333333;
        display: block;
    }
    .text-large {
        // font-size:22px;
        font-size: 1.6em;
    }
    p {
        font-family: $font-os;
        // font-size: 18px;
        font-size:1.4em;
        color: #333333;
        width: 100%;
        padding: 10px 0 0;
        line-height:1.3;
    }
}


.mailbox {
    padding: 25px 0 0;
    text-align: center;

    .btn {
        margin:40px 0 0;
    }

    .text-center {
        color: #333333;
        font-size: 1.4em;
        font-family: $font-os;

        p {
            line-height: 1.2;
            padding: 0 0 0 20px;
            color: #666666;
            margin: 0;
            font-size: 1.5em;

            &:first-child {
                color:#333333;
                font-size: 1.2em;
            }
        }
    }
}

.fail-block {
    overflow: hidden;
    width:100%;
    padding: 25px 0 0;

    .text-center {
        color:#33333;
        font-family: $font-os;
        p {
            line-height: 1.2;
            font-size:1.4em;
            &:first-child {
                font-size: 1.6em;
            }
        }
    }
    .btn {
        margin-top: 40px;
    }
}

.seat {
    li {
        width: 20px;
        height: 20px;
        display: block;
        float: left;
        text-align: center;
        cursor: pointer;
        border: 1px solid #a2570d;
        border-radius: 2px;
        margin: 0 5px 9px 0;
        span {
            display: inline-block;
            padding: 5px 0; 
        }
    }
    .blank {
        border:none;
    }
}

.seat-a {
    width: 80px;
    float: left;
}

.tabs-block {
    overflow:hidden;
    width:100%;
    margin-bottom: 50px;
    .nav-tabs {
        text-align: center;
        width: 100%;
        border:none;
        background:#e8e8e8;
        li {
            width: 42%;
            background: url(../images/line-tabs.png) 0 center no-repeat;
            display: block;
            float: left;
            &:first-child {
                width: 28%;
                padding:0;
                margin: 0;
                background:none;
            }
            &:last-child {
                width: 30%;
            }
            &:hover {
                a {
                    color: #333333;
                    background: none;
                    border: none;
                    .numb {
                        background-color: #ee3e80;
                        color: #ffffff;
                    }
                }
            }
            &.active {
                position: relative;
                z-index: 10;
                a {
                    color: #ec4280;
                    background: #cccccc;
                    &:before {
                        content: '';
                        background:url(../images/bgd-tabs-hover.png) 100% 0 no-repeat;
                        position:absolute;
                        right:-18px;
                        top:0;
                        width: 25px;
                        height: 55px;
                    }
                    .numb {
                        background-color: #ee3e80;
                        color: #ffffff;
                    }
                }
                .last {
                    &:before {
                        background:none;
                    }
                    &:after {
                        content: '';
                        background:url(../images/bgd-tabs-hover-after.png) 0 0 no-repeat;
                        position:absolute;
                        left:-16px;
                        top:0;
                        width: 30px;
                        height: 55px;
                    }
                }
                .mid {
                    &:after {
                        content: '';
                        background:url(../images/bgd-tabs-hover-after.png) 0 0 no-repeat;
                        position:absolute;
                        left:-16px;
                        top:0;
                        width: 30px;
                        height: 55px;
                    }
                }
            }
            a {
                background:none;
                border:none;
                font-size:1.2em;
                display: block;
                line-height: 35px;
                font-family: $font-os;
                font-weight: bold;
                color: #f3d0dd;
                cursor: pointer;
                padding: 3px 10px 4px;
                .numb {
                    display: block;
                    font-size: 24px;
                    background: #f3d0dd;
                    width: 30px;
                    height: 30px;
                    line-height: 30px;
                    text-align: center;
                    color: #f6f6f6;
                    float:left;
                    margin-right: 10px;
                }
            }
        }
    }
    .tab-content {
        margin: 0 auto;
        overflow:hidden;
        width:100%;
        .hightline-text {
            background: url(../images/line-1.png) 0 center repeat-x;
            min-width: 320px;
            position: relative;
            margin: 35px 0;
            min-height: 40px;
            span {
                color: #666666;
                text-transform: uppercase;
                display: block;
                font-family: $font-os;
                background:#f4f4f4;
                position:absolute;
                min-width: 180px;
                text-align: center;
                left: 50%;
                top: 50%;
                padding:0;
                min-width: 200px;
                font-size: 1.5em;
                margin:-16px 0 0 -90px;
            }
        }
        .hot-line {

            margin:20px 0 0;
            display:block;
            font-family: $font-os;
        font-size: 1.4em;
        }
    }

    .lnk-next-step {


        font-family: $font-roboto;











        text-align: left;
        .fa {
            margin-left: 12px;
            float:right;
        }
    }
    .lnk-back-step {
        text-transform: uppercase;
        text-align: center;
        font-family: $font-roboto;
        height: 34px;
        font-size: 22px;
        line-height: 34px;
        float: left;
        background-color: #333333;
        width: auto;
        margin: 20px 0;
        padding: 0 15px;
        display: block;
        color: #ffffff;

        .fa {
            margin-left: 12px;
        }
    }
}



.table > thead > tr > th, 
.table > thead > tr > td, 
.table > tbody > tr > th, 
.table > tbody > tr > td, 
.table > tfoot > tr > th, 
.table > tfoot > tr > td {
    padding:8px 0;
}

.table {
    .header-title th{
        font-size:1.6em;
        font-weight: 500;
    }
    td {
        font-size:1.2em;
        font-family:$font-os;
        color:#333333;
    }
}
.tab-pane-step-1 {
    .arrow_box {
        position: absolute;
        left: 25%;
        top: 58%;
        background: #fff;
    }
    .arrow_box:after {
        bottom: 100%;
        left: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(255, 255, 255, 0);
        border-bottom-color: #fff;
        border-width: 16px;
        margin-left: -16px;
    }
}
.tab-pane-step-2 {
    .arrow_box {
        position: absolute;
        left: 41%;
        top: 58%;
        background: #fff;
    }
    .arrow_box:after {
        bottom: 100%;
        left: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(255, 255, 255, 0);
        border-bottom-color: #fff;
        border-width: 16px;
        margin-left: -16px;
    }
}
.order-table {
    margin-top: 10px;

    .footer-row {
        .text-right {
            color: #ee3e80;
            text-transform: uppercase;
        }
    }
    .title {
        font-size:1.4em;
    }
    .cost {
        font-size:1.4em;
    }
    .seat {
        font-size:1.4em;
        span {
            color:#ee3e80;
        }
    }
    .text-right {
        span {
            &:first-child {
                font-weight: bold;
            }
        }
    }
    ul {
        padding:0;
        margin:0;
    }
    .list-products {
        margin:0;
        padding:0;
        width: 100%;
        overflow: hidden;

        &.type-2 {
            li {
                border-top: 1px dashed #999999;

                &:first-child {
                    border-top: none;
                }
            }
        }
        > li {
            width: 100%;
            padding: 15px 0;
            font-family: $font-os;
            overflow: hidden;
            .pull-left {
                width: 70%;
                float: left;
            }
            span {
                display: block;
                span {
                    display: inline-block;
                }
            }
            .text-right {
                span {
                    font-size: 1.4em;
                }
            }
        }
        .infor-products {
            overflow: hidden;
            padding-top: 20px;
            width: 100%;

            li {

                font-size: 0.9em;
                line-height: 1.3;
            }
        }
        .more-details {
              width: 100%;
              overflow: hidden;

              background: url(../images/line-more-details.png) 0 100% repeat-x;
              padding: 12px 0 0 0;
            a {
                color: #ec4280;
                display: inline-block;
                float: right;
                background: #f4f4f4;
                padding: 10px 5px 0px 10px;

                font-size: 1.2em;
                font-style: italic;
                line-height: 1;
            }
        }
    }
    tbody, thead, tfoot {
        tr {
            th{
                padding: 20px 0;
                font-size: 26px;
                font-family: $font-roboto;
                line-height: 1.2em;
                color: #333333;
            }
            td{
                padding: 10px 0;
                font-size: 1.4em;
                font-family: $font-os;
                color: #333333;
            }
            span {
                display: block;
                &:first-child {
                    font-weight: bold;
                }
            }
        }
    }
    tbody {
        tr {
            th {
                border-top:0;                
            }
            td {
                border-top: 0;
                vertical-align: top;
            }
        }
        .footer-row {
            td {
                font-size:18px;

                &:first-child {
                    font-family: $font-roboto; 
                }
            }
        }
    }

    .options {
        padding-left:10px;
        .fa-exclamation-circle {
            font-size: 18px;
            color:#ccc;
        }
        &:hover {
            .fa-exclamation-circle {
                font-size: 18px;
                color:#ee3e80;
            }   
        }
    }
    .quality {
        background:#f4f4f4;
        @include box_shadow(0);
        @include border-radius(0);
        border:0;
        max-width: 80px;
        float:right;
        color: black;
        font-size: 16px;
        font-family: $font-os;
    }
    .wrap-discount-code {
        background: url('../images/bg-discount-code.png') no-repeat 0 0;
        width: 239px;
        height: 72px;
        position: relative;

        input {
            position: absolute;
            top: 13px;
            left: 0;
            margin-left: 15px;
            height: 35px;
            width: 75%;
            font-family: $font-os;
            border: 0;
            background: none;
            font-size: 14px;
            outline: none;

            &:hover {
                border: none;
                background: none;
            }
            &:focus {
                border: none;
                background: none;
            }
        }
        .icon-valid {
            background: url('../images/icon-valid-blk-discount.png') no-repeat 0 0;
            width: 16px;
            height: 15px;
            position: absolute;
            top: 20%;
            right: 10%;
            cursor: pointer;
        }
    }
    .wrap-cost {
        .title {
            font-family: $font-roboto;
            font-size: 2em;
            color: #333333;
            text-transform: uppercase;
            display: block;
            line-height: 1.2em;
            margin: 0 18px 0 0;
            float:left;
        }
        .cost {
            font-family: $font-os;
            font-weight: bold;
            font-size: 18px;
            color: #ee3e80;
            display: block;
            float:right;
            .before-discount {
                text-decoration: line-through;
                display: block;
            }
            .after-discount {
                color: #ee3e80;
                display: block;
            }
        }
        .icon-convert {
            background: url('../images/icon-convert.png') no-repeat 0 0;
            width: 18px;
            height: 36px;
            display: inline-block;
            float:right;
        }
    }
}

.booking-seat {
    .col-lg-9 {
        padding: 45px 0 0 60px;
        background-color: #ffffff;
    }
    .col-lg-3 {
        padding: 0 0 0 10px;
    }
    .row {
        background-color: #f4f4f4;
    }
    .note {
        font-family: $font-os;
        font-size: 14px;
        color: #333333;
        line-height: 1.3em;
    }
    .wrap-list-status-seat {
        margin: 20px 0;

        li {
            float: left;
            margin-right: 40px;

            .fa {
                width: 20px;
                height: 20px;
                display: block;
                float: left;
                margin-right: 14px;

                &.fa-seat-booked {
                    background: url('../images/icon-seat-booked.png') no-repeat 0 0;
                }
                &.fa-seat-available {
                    background: url('../images/icon-seat-available.png') no-repeat 0 0;
                }
            }
            span {
                line-height: 20px;
                display: block;
                float: left;
                font-family: $font-os;
                font-size: 14px;
                color: #333333;
            }
        }
    }
    .wrap-seat-diagram {
        margin-bottom: 40px;
    }
    .inner-left {
        padding: 45px 0 0 20px;
        background-color: white;      
    }
    .wrap-items-ticket {
        margin: 0;
        padding: 0;

        .item {
            border-bottom: 1px dashed #e8e8e8;
            padding: 20px 0 15px 0;
            
            &:first-child {
                padding-top: 0;
                border-top: 0;
            }
            span {
                display: block;
                font-family: $font-os;
                font-size: 16px;
                color: #333333;

                &.type-ticket {
                    font-weight: bold;
                    max-width: 240px;
                }
                &.price-ticket {
                    margin-top: 10px;
                }
                &.code-name-ticket {
                    font-size: 13px;
                    color: #ee3e80;
                    margin-top: 20px;
                }
                .fa-exclamation-circle {
                    color: #cccccc;
                    margin-left: 14px;
                }
            }
            .warp-select-quality {
                margin-top: 18px;
                background:#f4f4f4;
                @include box_shadow(0);
                @include border-radius(0);
                border:0;
                max-width: 80px;
                color: black;
                font-size: 16px;
                font-family: $font-os;
            }
        }
    }
    .wrap-discount-code {
        background: url('../images/bg-discount-code.png') no-repeat 0 0;
        width: 239px;
        height: 72px;
        position: relative;
        margin-top: 25px;

        input {
            position: absolute;
            top: 13px;
            left: 0;
            margin-left: 15px;
            height: 35px;
            width: 75%;
            font-family: $font-os;
            background: none;
            border: none;
            outline: none;
        }
        .icon-close {
            background: url('../images/icon-close-blk-discount.png') no-repeat 0 0;
            width: 14px;
            height: 14px;
            position: absolute;
            top: 20%;
            right: 10%;
            cursor: pointer;
        }
    }
    .wrap-total-price {
        padding: 30px 0;

        label {
            font-size: 24px;
            font-family: $font-roboto;
            font-weight: normal;
            color: #333333;
            display: block;
        }
        .total {
            font-size: 22px;
            font-family: $font-os;
            font-weight: bold;
            color: #ee3e80;
            display: block;
            margin-top: 10px;
        }
    }
}

.customer-infor-table {
    border-top: 1px solid #999999;
    /* min-height: 405px; */
    tbody {
        tr {
            th {
                border-top:0;
                padding: 20px 0;
                font-size: 26px;
                font-family: $font-roboto;
                line-height: 1.2em;
                color: #333333;
                text-transform: uppercase;
            }
            td {
                border-top: 0;
                width: 64%;
                font-size: 1.4em;
                &:first-child {
                    width: 35%;
                }
            }
        }
    }
}

.block-1 {
    background: #ffffff;
    display: block;
    padding: 0 0 20px;
    .top {
        width: 100%;
    }
    .breadcrumb-block {
        padding: 5px 0;

        .fa-home {
            color:#666;
            // font-size: 20px;
            font-size: 1.4em;
        }
    }
    .breadcrumb {
        background-color:white;
        margin: 0;
        display: inline-block;
        padding:8px 5px;

        > li + li:before {
            padding:0;
        }
        li {
            font-family: $font-os;            
            a {
                font-family: $font-os;
                color: #666666;

            }
            &.active {
                color: #333333;             
            }
        }
    }
    .calendar {
        display: inline-block;
        padding: 0;
        margin: 10px 0 0 0;
        width: 100%;
        li {
            padding: 0;
            width: 100%;
        }
         .dropdown {
            padding: 0;
            width: 100%;
            margin-bottom: 3px;
            .btn-choose-time {
                border: 1px solid #cccccc;
                text-transform: capitalize;
                width: 90%;
            }
        }
    }
    .text-1 {
        padding: 15px 0;
        overflow: hidden;
        width: 100%;        
        .title {
            margin: 0;
            // font-size:2em;
            font-size:2.2em;
            font-family: $font-roboto;
            color: #ec4280;
            text-transform: uppercase;
            padding:5px 0;
        }
        .pull-right {
            margin-top: 45px;
        }
    }
    .sub-title {
        font-family: $font-roboto;
        font-size:1.2em;
        color: #666666;
        text-transform: uppercase;
        font-weight: 500;
        display: block;
    }
    .infor-block {
        padding: 15px 0;
        .date-time-sl {
            height: 40px;
            line-height: 40px;
            padding-left:30px;
        }
        .pull-right {
            margin-bottom: 0;

            li {
                position: relative;
            }
        }
        select.form-control {
            border:1px solid #d8d6d7;
            background: #efefef;
            outline: none;
            @include border-radius(0);
            @include box_shadow(0);
            font-size:1.4em;
        }
    }   
    .note {
        font-family: $font-roboto;
        font-size:1.4em;
        color: #ee3e80;
        line-height: 1em;
    }
}

.events {
    overflow: hidden;
    width: 100%;

    .view-people {
        background: #cccccc;
        overflow: hidden;
        width: 100%;

        span {
            font-family: $font-os;
            font-size:1.4em;
            color: #333333;
            display: block;
            line-height: 24px;
        }
        img {
            max-width: 22px;
            display: inline-block;
            margin: 0 1px;
        }
        .inner {
            overflow: hidden;
            height: 42px;
            line-height: 42px;

            span {
                line-height: 40px;

                strong {
                    color: #333333;
                }
            }
            .list-img-people {
                padding-right: 1%;
            }
        }
    }
    .wrap-carousel {
        width: 100%;
        overflow: hidden;
        position:relative;
        max-height: 345px;
    }
    .date-time {
        display: block;
        -ms-transform: rotate(90deg); /* IE 9 */
        -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
        transform: rotate(90deg);
        position:absolute;
        bottom:0;
        top:0;
        left:-5px;

        span {
            display: block;
            text-align: center;
            font-size:1.4em;
            font-family: $font-roboto;

            &.date {
                font-size:1.4em;
                font-family: $font-roboto;
                color: #ec4280;
            }
        }
    }
    .news {
        position: absolute;
        z-index: 10;
        text-align: left;
        right: 0;
        top:0;
        bottom:0;
        -moz-transform: rotate(-90deg); /* IE 9 */
        -ms-transform: rotate(-90deg); /* IE 9 */
        -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
        transform: rotate(-90deg);
        z-index: 100;

        li {
            margin-bottom: 2px;
            border:none;
            border-radius:0;
            background:none;
            padding:0;
            width: 345px;
            position: relative;
            a {
                display: block;
                cursor: pointer;
                background: url(../images/bgd-transparent-gray.png);
                cursor: pointer;
                padding:18px 15px;
                text-decoration: none;
                color: white;

                &:hover {
                    background:url(../images/bgd-transparent-pink.png);

                    .title {
                        color: white;
                    }
                    span {
                        color: white;
                    }
                }
                &.active {
                    background:url(../images/bgd-transparent-pink.png);

                    .title {
                        color: white;
                    }
                    span {
                        color: white;
                    }
                }
            }
        }
        .title {

            -moz-transform: rotate(180deg);
            -ms-transform: rotate(180deg); /* IE 9 */
            -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
            transform: rotate(180deg);
            display: block;
        }
    }
}

.list-box {
    .list-events {
        .item {
            position: relative;
        }
    }
}
.list-box-large,
.list-box-small {
    .inner {
        padding-bottom:15px;
    }
    .news-item {
        overflow: hidden;
    }
}

.infor-block {
    .address-infor {
        .fa {
            margin:3px 12px 0 0;
            display: block;
            float: left;
            font-size: 1.8em;
        }
        a {
            font-family: $font-os;
            // font-size: 14px;
            font-size:1.4em;
            display: block;
            float: left;
            width: 90%;
            line-height: 1.2em;
            color: #333;
            &:hover {
                text-decoration: underline;
            }
        }
    }    
    .btn-default {
        width: 100%;
        // font-size: 26px;
        font-size:1.4em;
        height: 41px;
        font-family: $font-roboto;
        background-color: #ec4280;
        line-height: 41px;
        margin: 0;
        padding: 0 20px;
    }
}

.details-block {
    margin: 55px 0 0;

    .left-details {
        margin-top: 7px;
    }
    .organizer-info {
        .content {
            background:white;
            overflow: hidden;
            .inner-content {
                padding:50px 20px;
                overflow: hidden;
                display: table;
            }
            .thumb {
                display: block;
                float: left;
                border-right: 1px solid #ccc;
                padding:10px 20px 10px 0;
                margin-right: 20px;
            }
            .text-1 {
                margin-left: 160px;
                display: table-cell;
                vertical-align: middle;
                min-height: 71px;

                font-family: $font-os; 
                line-height: 1.3;
            }
        }
    }
    .carousel-control-carousel-2 {
        &.left {
            background: url('../images/icon-prev-carousel.png') no-repeat 0 50%;
        }
        &.right {
            background: url('../images/icon-next-carousel.png') no-repeat 100% 50%;   
        }
    }
}

.recommend-shows {
    overflow: hidden;
    .title {
        font-size: 2em;
        color: #333333;
    }
}

.ticket-infor {
    overflow: hidden;
    .title {
        margin: 0;

        font-family: $font-roboto;
        color: #333333;
    }
    .desc {
        margin-top: 35px;
        color: #333333;
        font-family: $font-os;
        font-size: 1.4em;

        strong {
            font-weight: bold;
        }
    }
}

.video-block {
    overflow: hidden;
    margin-top: 30px;
    width: 100%;
    iframe {
        width: 100%;
        display: block;
    }
    .caption {
        overflow: hidden;
        margin-top: 25px;
        margin-top: 40px;
        color: #333333;
        font-family: $font-os;
        font-size: 14px;

        strong {
            font-weight: bold;
        }
        p {
            line-height: 1.3;
        }  
    }
}

.comment-block {
    overflow: hidden;
    margin: 20px 0 60px;
}

.dropdown {
    width: 100%;
    height: 41px;
    line-height: 41px;
    font-family: $font-roboto;
    background-color: white;
    padding: 0 15px;

    &.type-1 {
        max-width: 81px;
        height: 32px;
        line-height: 32px;
        float: right;
        cursor: pointer;
        padding-right: 0;
        .wrap-icon {
            display: block;
            float: right;
            padding: 0 14px;
            background: #cccccc;
        }
    }
    &.type-2 {
        max-width: 81px;
        height: 32px;
        line-height: 32px;
        display: block;
        cursor: pointer;
        padding-right: 0;
        margin-top: 20px;

        .wrap-icon {
            display: block;
            float: right;
            padding: 0 14px;
            background: #cccccc;
            
            .fa {
                margin-left: 0;
            }
        }
    }

    .fa-calendar, .fa-clock-o {
        position: relative;
        top: -2px;
        font-size: 16px;
    }
    .warp-blk-list-calendar {
        background-color: #cccccc;
        height: auto;
        border: none;
        padding: 0;
        margin: 10px 0 0;
        border-radius: 0;

        .arrow_box {
            position: relative;
            background: #cccccc;
            position: absolute;
            top: 0px;
            right: 20%;
        }
        .arrow_box:after {
            bottom: 100%;
            left: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(204, 204, 204, 0);
            border-bottom-color: #cccccc;
            border-width: 8px;
            margin-left: -8px;
        }
        .fa-google-calendar {
            background: url('../images/icon-google-calendar.png') no-repeat 0 0;
            width: 19px;
            height: 17px;
        }
        .fa-i-calendar {
            background: url('../images/icon-i-calendar.png') no-repeat 0 0;
            width: 21px;
            height: 17px;   
        }
        .fa-outlook-calendar {
            background: url('../images/icon-outlook-calendar.png') no-repeat 0 0;
            width: 20px;
            height: 17px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                display: block;
                float: none;                    
                padding: 11px;
                width: 100%;
                overflow: hidden;
                line-height: 17px;

                &:hover {
                    background-color: #333333;

                    a {
                        color: #ffffff;
                    }
                }
                .fa {
                    display: block;
                    float: left
                }
                a {
                    display: block;
                    float: left;
                    font-size: 15px;
                    font-family: $font-os;
                    margin-left: 5px;
                    color: #000000;
                }
            }
        }
    }
    .warp-blk-choose-time {
        background-color: #cccccc;
        height: auto;
        border: none;
        padding: 0;
        margin: 10px 0 0;
        border-radius: 0;

        .arrow_box {
            position: relative;
            background: #cccccc;
            position: absolute;
            top: 0px;
            right: 20%;
        }
        .arrow_box:after {
            bottom: 100%;
            left: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(204, 204, 204, 0);
            border-bottom-color: #cccccc;
            border-width: 8px;
            margin-left: -8px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                display: block;
                float: none;                    
                padding: 11px 20px;
                width: 100%;
                overflow: hidden;
                line-height: 17px;

                &:hover {
                    background-color: #333333;

                    a {
                        color: #ffffff;
                    }
                }
                a {
                    display: block;
                    float: left;
                    font-size: 15px;
                    font-family: $font-os;
                    margin-left: 5px;
                    color: #000000;
                }
            }
        }
    }
    .warp-blk-choose-quantity {
        background-color: #cccccc;
        height: auto;
        border: none;
        padding: 0;
        min-width: 80px;
        margin: 10px 0 0;
        border-radius: 0;

        .arrow_box {
            position: relative;
            background: #cccccc;
            position: absolute;
            top: 0px;
            right: -30%;
        }
        .arrow_box:after {
            bottom: 100%;
            left: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(204, 204, 204, 0);
            border-bottom-color: #cccccc;
            border-width: 8px;
            margin-left: -8px;
        }
        ul {
            margin: 0;
            padding: 0;

            li {
                display: block;
                float: none;                    
                padding: 11px;
                width: 100%;
                overflow: hidden;
                line-height: 17px;
                border: none;

                &:hover {
                    background-color: #333333;

                    a {
                        color: #ffffff;
                    }
                }
                .fa {
                    display: block;
                    float: left
                }
                a {
                    display: block;

                    font-family: $font-os;
                    margin-left: 5px;
                    text-align: left;
                    color: #000000;
                }
            }
        }
    }
    .btn-add-calendar {
        text-transform: uppercase;
        color: #666666;
        margin-left: 10px;
        background: none;
        line-height: 41px;
        padding: 0;
        display: inline-block;
        vertical-align: top;
    }
    .btn-choose-time {
        text-transform: uppercase;
        color: #666666;
        margin-left: 10px;
        background: none;
        line-height: 41px;
        padding: 0;
        display: inline-block;
        vertical-align: top;;
        font-size: 1.4em;
    }
    .btn-choose-quantity {
        text-transform: uppercase;
        color: #666666;        
        padding: 0;
        background: none;
        height: 35px;
        line-height: 35px;
        display: block;
        float: left;
        font-family: $font-os;
    }        
}

.infor-products {
    color: #999999;
    font-size: 1.4em;
    width: 100%;
    overflow: hidden;
    p {
        line-height: 1.2;
        margin:0;
    }
    img {
        display: block;
        width: 100%;
        height: auto;
    }
}
.seat-map {
    overflow: hidden;
    margin-top: 30px;
    p {
        margin-top: 10px;
        font-size: 1.4em;
        text-align: center;
        font-family: $font-os;
    }
}